<!doctype html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="Author" content="只会切图的前端">
    <title>项目展示</title>
    <link rel="stylesheet" href="./css/index.css" />
</head>

<body>
    <!--导航-->
    <header class="header">
        <div class="nav-box">
            <span>个人介绍</span>
            <ul class="nav">
                <li><a href="index.html">首页</a></li>
                <li><a href="project.html" class="on">作品展示</a></li>
                <li><a href="concat.html">联系我</a></li>
            </ul>
        </div>
    </header>
    <!--导航end-->
    <!--banner-->
    <div class="banner">
        项 目 展 示
    </div>
    <!--banner end-->
    <!--个人介绍-->
    <div class="main-box">
        <div class="flex-box">
            <div class="block">
                <div class="desc">
                    canvas制作代码雨
                </div>
                <img class="pic" src="./img/1.png" width="300" />
            </div>
            <div class="block">
                <div class="desc">css制作冰墩墩</div>
                <img class="pic" src="./img/2.png" width="300" />
            </div>
            <div class="block">
                <div class="desc">css制作名侦探柯南</div>
                <img class="pic" src="./img/3.png" width="300" />
            </div>
        </div>
        <div class="flex-box">
            <div class="block">
                <div class="desc">css制作小老虎</div>
                <img class="pic" src="./img/4.png" width="300" />
            </div>
            <div class="block">
                <div class="desc">css制作旋转相册</div>
                <img class="pic" src="./img/5.png" width="300" />
            </div>
            <div class="block">
                <div class="desc">html制作音乐播放器</div>
                <img class="pic" src="./img/6.png" width="300" />
            </div>
        </div>

        <div class="flex-box">
            <!-- <div class="block">
                <div class="desc">html制作商城</div>
                <img class="pic" src="./img/7.png" width="300" />
            </div> -->
            <div class="block">
                <div class="desc">html表白网页</div>
                <img class="pic" src="./img/8.png" width="300" />
            </div>
            <div class="block">
                <div class="desc">css绘制夕阳</div>
                <img class="pic" src="./img/9.png" width="300" />
            </div>
        </div>



    </div>
    <!--个人介绍end-->

    <div class="foot-box">
        Copyright © 2022.Company name All rights reserved.
    </div>
</body>

</html>